<template>
    <div class="main member-upgrade">
        <section>
            <el-form :model="formData" ref="form" label-width="100px">
                <el-form-item label="用户：" :rules="commonRules.notNullRule" prop="mobiles">
                    <el-input type="textarea" v-model="formData.mobiles" size="small" placeholder="请输入手机号，多个手机时以逗号分割（英文下逗号）"></el-input>
                </el-form-item>
                <el-form-item label="结果：" v-show="msg">
                    <div class="result" v-html="msg"></div>
                </el-form-item>
                <el-form-item label="">
                    <el-button type="primary" size="small" @click="upgrade" :disabled="btnDisabled">升级新大区</el-button>
                </el-form-item>
            </el-form>
        </section>
    </div>
</template>
<script>
    export default {
        name: 'upgradeNewRegion',
        data(){
            return {
              msg: '',
                formData: {
                  mobiles: ''
                },
                btnDisabled: false
            }
        },
        methods: {
            upgrade(){
                this.$refs.form.validate(valid => {
                    if (!valid) {
                        return false;
                    }
                    let list = this.formData.mobiles
                    let result = list.split(',')
                    this.formData.mobileList = result
                    this.btnDisabled = true;
                    this.request({
                        url: '/bsnl-product/box/label/updateRegionBxNew',
                        method: 'post',
                        data: this.formData
                    }).then(res => {
                        this.btnDisabled = false;
                        this.msg = res.message
                    }).catch(err => {
                        this.btnDisabled = false;
                    });
                });
            }
        }
    }
</script>
<style lang="scss" scoped>
.result {
  color: green;
}
</style>